<script>
import { reactive } from 'vue'

export default {
  setup() {
    // reactive 将复杂类型数据, 转换成响应式数据
    // PS：返回值为该对象的响应式代理 Proxy
    const obj = reactive({
      name: 'zs',
      age: 18,
    })

    const btn = () => {
      obj.age++
      console.log(obj)
    }

    return { obj, btn }
  },
}
</script>

<template>
  <h1>Hello vue3</h1>
  <h2>{{ obj }}</h2>
  <button @click="btn">点击年龄加1</button>
</template>
